<style>
    div.buttons{
        background-image: url("/easyui/images/linkbutton_bg.png");
        background-position: right 0;
        background-repeat: no-repeat;
        border-radius: 5px 5px 5px 5px;
        color: #444444;
        cursor: pointer;
        display: inline-block;
        float: right;
        font-size: 12px;
        height: 24px;
        outline: medium none;
        padding-right: 18px;
        text-decoration: none;
        float: left;
    }
    input[type="submit"]{
        background: url("/easyui/images/button_span_bg.gif") no-repeat scroll left top transparent;
        display: inline-block;
        height: 24px;
        line-height: 18px;
        padding: 4px 0 4px 18px;
        border: 0;
    }
    div.row label{
        min-width: 80px;
    }
    input[disabled], select[disabled], textarea[disabled], input[readonly], select[readonly], textarea[readonly] {
        cursor:pointer;
    }
    select.combo{
        width: auto;
    }
    div#time1,div#time2,input#Imgs_ctime, input#Imgs_utime{
        float: left;
        display: inline-block;
    }
    div#time1{
        margin-right: 20px;;
    }
    img.clock{
        display: none;
    }
    div#ui-datepicker-div{display: none;}
</style>
<link rel="stylesheet" type="text/css" href="/ui/themes/default/easyui.css" />
<link rel="stylesheet" type="text/css" href="/ui/themes/icon.css" />

<link rel="stylesheet" type="text/css" href="/time/css/ui/base/ui.core.css" />
<link rel="stylesheet" type="text/css" href="/time/css/ui/base/ui.theme.css" />
<link rel="stylesheet" type="text/css" href="/time/css/ui/base/ui.slider.css" />
<link rel="stylesheet" type="text/css" href="/time/css/jquery.timepicker.css" />
<script type="text/javascript" src="/time/lib/jquery.jtimepicker.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('#time1').jtimepicker({
           'hourCombo':'h1',
           'minCombo':'m1',
           'secCombo':'s1',
            'hourDefaultValue':<?php echo isset($h1) ? $h1 : 0;?>,
            'minDefaultValue':<?php echo isset($m1) ? $m1 : 0;?>,
            'secDefaultValue':<?php echo isset($s1) ? $s1 : 0;?>
//            'clockIcon':'/time/images/icon_clock_2.gif'
        });
        $('#time2').jtimepicker({
            'hourCombo':'h2',
            'minCombo':'m2',
            'secCombo':'s2',
            'hourDefaultValue':<?php echo isset($h2) ? $h2 : 0;?>,
            'minDefaultValue':<?php echo isset($m2) ? $m2 : 0;?>,
            'secDefaultValue':<?php echo isset($s2) ? $s2 : 0;?>
//            'clockIcon':'/time/images/icon_clock_2.gif'
        });
    });
</script>

<div class="form" style="border: 1px solid #99BBE8;padding: 20px 0;width: 100%;display: inline-block;">
<?php 
$form=$this->beginWidget('bootstrap.widgets.TbActiveForm', array(
	'id'=>'Ajax_google_code',
	'enableAjaxValidation'=>false,
	//'htmlOptions'=>array('enctype'=>'multipart/form-data'),
    'htmlOptions'=>array('style'=>'margin: 0 0 20px 60px;'),
));
?>
	<div class="row">
		<?php echo $form->labelEx($model, '起止日期'); ?>
        <input class="easyui-datetimebox" value="<?php echo isset($ctime) ? $ctime : ''; ?>" style="width:150px" name='ctime' id="ctime" />
        <input class="easyui-datetimebox" value="<?php echo isset($utime) ? $utime : ''; ?>" style="width:150px" name='utime' id="utime" />
	</div>



    <div class="row">
        <?php
//        $user_r = array();
//        $users = User::model()->findAll();
//        foreach($users as $user){
//            $user_r[$user->id]=$user->username;
//        }
        $user_r=getGroupUser(Yii::app());
        echo $form->dropDownListRow($model, 'uid', $user_r);  ?>
    </div>

    <div class="row" >
        <?php
        $speed_r = array('50'=>'快','200'=>'中', '350'=>'慢');
        echo $form->dropDownListRow($model, 'order', $speed_r);  ?>
    </div>

	<div class="row buttons">
		<?php echo CHtml::submitButton($model->isNewRecord ? Yii::t('admin/Common', '查看') : Yii::t('admin/Common', '查看')); ?>
	</div>
    <div style="margin:10px 0;float: left;clear: both;display: none;">
        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#map').dialog('open')">打开窗口</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#map').dialog('close')">关闭窗口</a>
    </div>
<?php $this->endWidget(); ?>


<?php  Yii::app()->clientScript->registerCoreScript('jquery')?>
<script src="http://maps.google.com/maps/api/js?v=3.1&sensor=true" type="text/javascript"></script>

<script type="text/javascript">

    function init() {

        $.ajax({
            type: "GET",
            url: "/index.php/imgs/Ajax_google_allshop",
            data: "d",
            success: function(msg){
                if(msg.outshop[0] != undefined){
                    var myLatlng = new google.maps.LatLng(msg.outshop[0]['latitude'],msg.outshop[0]['longitude']);
                }else{
                    alert('至少要设置一个店铺作为地图的中心点');
                    return;
                }

                var myOptions = {
                    zoom: 12, center: myLatlng, disableDefaultUI: true,mapTypeControl: false, mapTypeId: google.maps.MapTypeId.ROADMAP
                }
                var shop = <?php echo Yii::app()->request->baseUrl; ?>'/images/shop.png';
                var factory = <?php echo Yii::app()->request->baseUrl; ?>'/images/factory.png';
                var depot = <?php echo Yii::app()->request->baseUrl; ?>'/images/depot.png';
                var shop_del = <?php echo Yii::app()->request->baseUrl; ?>'/images/shop_del.png';
                var factory_del = <?php echo Yii::app()->request->baseUrl; ?>'/images/factory_del.png';
                var depot_del = <?php echo Yii::app()->request->baseUrl; ?>'/images/depot_del.png';

                var map = new google.maps.Map(document.getElementById("map"), myOptions);
                function setMarckersshop(map,locations){

                    for(var i = 0;i < locations.length;i++){
                        if(locations[i].type ==0){var image = shop;};
                        if(locations[i].type ==1){var image = factory;};
                        if(locations[i].type ==2){var image = depot;};

                        if(locations[i].type ==10){var image = shop_del;};
                        if(locations[i].type ==11){var image = factory_del;};
                        if(locations[i].type ==12){var image = depot_del;};

                        var number = locations[i].number;
                        var longitude = locations[i].longitude;
                        var latitude = locations[i].latitude;
                        var address = locations[i].content;
                        var title = address;
                        var mylatlng = new google.maps.LatLng(latitude,longitude);
                        var marker = new google.maps.Marker({
                            position: mylatlng,
                            map: map,
                            icon: image
                        });
                        set_event(map,marker,title);
                    }
                }
                function set_event(map,marker,title){
                    //设置窗口显示信息
                    var infowindow = new google.maps.InfoWindow({
                        content: title
                    });
                    //注册图标事件
                    google.maps.event.addListener(marker,'mouseover',function() {
                        infowindow.open(map,marker);
                    });
                    google.maps.event.addListener(marker, 'mouseout',function() {
                        infowindow.close();
                    });
                }

                setMarckersshop(map,msg.outshop);


            },
            dataType:'json'
        });
    }
</script>

<body onLoad="init();">
    <div style="width:1026px; height:710px;margin:40px;clear: both;">
        <div class="panel-header"><div class="panel-title">显示轨迹</div><div class="panel-tool"></div></div>
        <div id="map" width="1024" height="700" title="显示轨迹" style="width:1024px; height:700px;border: 1px solid #99BBE8;"></div>
    </div>
</div><!-- form -->
